<template>
  <el-divider></el-divider>
  <div class="item">
    <el-card shadow="always">
      <el-descriptions
          :title="typeString"
          :column="1"
          border
          style="font-size: 16px;word-break: break-word;"
      >
        <template #extra>
          <el-button type="primary" @click="info">详情</el-button>
        </template>
        <el-descriptions-item>
          <template #label>
            <span class="label">申请编号</span>
          </template>
          {{applyItem.applyId}}
        </el-descriptions-item>
        <el-descriptions-item>
          <template #label>
            <span class="label">日期</span>
          </template>
          {{applyItem.applyDate}}
        </el-descriptions-item>

        <!--    认领申请-->
        <el-descriptions-item v-if="applyItem.type==='claim'">
          <template #label>
            <span class="label">认领学者</span>
          </template>
          {{applyItem.author}}
        </el-descriptions-item>
        <!--    管理类申请-->
        <el-descriptions-item v-else>
          <template #label>
            <span class="label">相关文献</span>
          </template>
          {{applyItem.title}}
        </el-descriptions-item>

      </el-descriptions>
    </el-card>
    
  </div>
  

  
  
</template>

<script>
import ApplyInfo from "./ApplyInfo";
export default {
  name: "ApplyItem",
  props:{
    applyItem:{
      type: Object
    },
    index:{
      type: Number
    }
  },
  data(){
    return{
      
    }
  },
  methods:{
    info(){
      this.$emit('info',this.applyItem.applyId,this.index);
    }
  },
  computed:{
    typeString(){
      switch (this.applyItem.type){
        case "claim":
          return "认领门户申请";
        case "add":
          return "上传文献申请";
        case "update":
          return "更新文献申请";
        case "delete":
          return "删除文献申请";
      }
    }
  },
  components:{
    ApplyInfo
  },
  emits:["info"]
}
</script>

<style scoped>
.item{
  padding: 5px 5px;
  border-bottom: 2px solid #07b5f9;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)
}
.label{
  word-break: keep-all;
}
</style>